1import { Fragment } from "react";
2import { getRepositoryCommits, NotFound } from "@/lib/dal";
3import Link from "@/ui/link";
4import { formatDateKey, formatTime } from "@/util";
5import { groupCommitsByDate } from "../util/commit";
6
7export default async function Page({
8  params,
9}: {
10  params: Promise<{ owner: string; repo: string }>;
11}) {
12  const { owner, repo } = await params;
13  const commitsData = await getRepositoryCommits(owner, repo);
14
15  if (!commitsData || commitsData === NotFound) return null;
16
17  const commitsByDate = groupCommitsByDate(commitsData.commits);
18
19  return (
20    <div className="flex flex-col">
21      {commitsByDate.map(([date, commits]) => (
22        <Fragment key={date}>
23          <div className="sticky top-0 bg-background flex items-center border-b px-2 h-9 z-10">
24            <h3 className="text-xs font-semibold text-muted-foreground uppercase tracking-wide">
25              {formatDateKey(date)}
26            </h3>
27          </div>
28          {commits.map((commit) => (
29            <Link
30              key={commit.sha}
31              href={`/${owner}/${repo}/commits/${commit.sha.substring(0, 7)}`}
32              className="flex w-full border-b hover:bg-accent/50 select-none cursor-pointer py-2 px-2"
33              prefetch={true}
34            >
35              <div className="flex flex-col w-full justify-start items-start min-w-0">
36                <div className="text-sm truncate mb-0.5 w-full">
37                  {commit.message}
38                </div>
39                <div className="text-xs text-muted-foreground flex items-center gap-1 w-full min-w-0">
40                  <span className="truncate min-w-0">
41                    {typeof commit.author === "string"
42                      ? commit.author
43                      : commit.author.name}
44                  </span>
45                  <span className="shrink-0">•</span>
46                  <span className="shrink-0">
47                    {formatTime(new Date(commit.date))}
48                  </span>
49                </div>
50              </div>
51            </Link>
52          ))}
53        </Fragment>
54      ))}
55    </div>
56  );
57}
58